<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>php-webdriver test page</title>
    <style>
        #red-box {
            position: absolute;
            top: 5px;
            left: 5px;
            width: 5px;
            height: 5px;
            background-color: #ff0000;
        }
    </style>
</head>
<body style="background-color: #fafaff;">
    <div id="red-box"></div>

    <h1 id="welcome">Welcome to the php-webdriver testing page.</h1>

    <a href="form.html" id="a-form">Form test page</a>
    |
    <a href="upload.html" id="a-form-upload">Form with file upload</a>
    |
    <a href="form_checkbox_radio.html" id="a-form-checkbox-radio">Form with checkboxes and radios</a>
    |
    <a href="open_new_window.html" id="a-new-window">New window opener test page</a>
    |
    <a href="delayed_element.html" id="a-delayed-element">Delayed render</a>
    |
    <a href="slow_loading.html" id="a-slow-loading">Slow loading page</a>
    |
    <a href="alert.html" id="a-alerts">Javascript alerts</a>
    |
    <a href="events.html" id="a-drag">Events</a>
    |
    <a href="sortable.html" id="a-sortable">Sortable</a>
    |
    <a href="web-components.html" id="a-web-components">WebComponents</a>

    <p id="id_test">Test by ID</p>
    <p class="test_class">Test by Class</p>
    <a href="#">Click here</a>
    <input type="text" name="test_name" value="Test Value"/>

<ul class="list">
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
</ul>

<ul class="other-list">
    <li>Foo</li>
    <li>Bar</li>
</ul>

<p id="text-simple" role="note" style="height: 5em; border: 1px solid black;">Foo bar text</p>
<p id="text-with-spaces">
    Multiple       spaces   are
    stripped
</p>

<div id="div-with-html" style="font-size: inherit;" title="Title" class="foo bar">
    <p>This <code>div</code> has some more <strong>html</strong> inside.</p>
    <hr />
</div>

<noscript id="noscript">
    <p>This element is only shown with JavaScript disabled.</p>
</noscript>

<div id="element-with-location" style="position: absolute; top: 550px; left: 33px; width: 333px; height: 66px;">
    Foo
</div>

<div id="element-out-of-viewport" style="position: absolute; top: 5000px; left: 33px; width: 333px; height: 66px;">
    Bar
</div>

<div id="hidden-element" style="display: none;">
    This is not visible!
</div>

</body>
</html>
